<template>
  <div class="b-card" :style="{ padding: mar }">
    <div class="card" :style="{ paddingBottom: padB }">
      <slot></slot>
    </div>
  </div>
</template>
<script setup lang="ts">
const { padB } = defineProps({
  mar: {
    type: String,
    default: '10px 14px 0px 14px'
  },
  padB: {
    type: String,
    default: '14px'
  }
})
</script>

<style lang="scss" scoped>
.b-card {
  width: 100%;
  box-sizing: border-box;

  .card {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    padding: 14px 16px 14px 16px;
    border-radius: 4px;
    background: white;
    box-shadow: 0 0 12px rgb(0 0 0 / 5%);
  }
}
</style>